<!--表扬表单-->
<template>
  <default-layout>
    <header-close :text="text" slot="header"></header-close>
    <div class="form" slot="main">
      <yd-cell-group>
        <yd-cell-item>
          <span slot="left" class="label required">主题：</span>
          <xf-input
            :valid="[{required: true, msg: '请填写主题'}]"
            v-model="form.esa201"
            ref="esa201"
            slot="right"
            placeholder="请填写主题"></xf-input>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label required">内容：</span>
          <yd-textarea
            maxlength="150"
            v-model.trim="form.esa202"
            slot="right"
            placeholder="请输入详细内容"></yd-textarea>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label">个人或单位名称：</span>
          <xf-input
            :valid="[]"
            v-model="form.aac003"
            ref="aac003"
            slot="right"
            placeholder="请填写个人或单位名称"></xf-input>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label">联系电话：</span>
          <xf-input
            :valid="[{required: false, msg: '请填写手机号'}, {reg: $regex.phone, msg: '手机号格式不正确'}]"
            v-model="form.aae005"
            ref="aae005"
            slot="right"
            placeholder="请填写手机号"></xf-input>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label required">发送部门：</span>
          <xf-picker
            :valid="[{required: true, msg: '请选择发送部门'}]"
            :list="list"
            v-model="form.ess101"
            ref="ess101"
            slot="right"
            placeholder="请选择发送部门"></xf-picker>
        </yd-cell-item>
        <yd-cell-item>
          <span slot="left" class="label required">是否公开：</span>
          <xf-radio
            required="请选择是否公开"
            :list="[{name: '是', value: '1'}, {name: '否', value: '2'}]"
            v-model="form.eso101"
            ref="eso101"
            slot="right"
            placeholder="请选择发送部门"></xf-radio>
        </yd-cell-item>
      </yd-cell-group>
      <div class="next">
        <mt-button type="primary" size="large" @click="onSubmit">提交</mt-button>
      </div>
    </div>
  </default-layout>
</template>
<script>
  import HeaderClose from '../../components/header-close/header-close.vue'
  import XfInput from '../../components/xf-input/xf-input.vue'
  import XfPicker from '../../components/xf-picker/xf-picker.vue'
  import XfRadio from '../../components/xf-radio/xf-radio.vue'
  import DefaultLayout from '../../layouts/default-layout/default-layout'
  import {validate, http} from '../../common/js/util'
  import {mapGetters} from 'vuex'

  export default {
    components: {
      DefaultLayout,
      XfRadio,
      XfPicker,
      XfInput,
      HeaderClose},
    computed: {
      ...mapGetters([
        'userInfo'
      ])
    },
    data() {
      return {
        text: '',
        list: [],
        form: {
          esa201: '', // 主题名称
          est020: '', // 信息类别
          esa202: '', // 信息内容
          aac003: '', // 个人或者单位名称
          aae005: '', // 联系电话
          ess101: '', // 发送部门编码
          eso101: '' // 是否公开
        }
      }
    },
    methods: {
      getUnit() {
        http({
          method: 'post',
          url: 'sapi/iwantsay/say/unit/about/list',
          data: {}
        }).then(res => {
          this.list = res.data.map(item => { return { value: item.value, name: item.label } })
        })
      },
      onSubmit() {
        if (this.form.esa202) {
          validate.bind(this)(this.form).then(() => {
            this.smt()
          }).catch(err => {
            console.log(err)
          })
        } else {
          this.$message.toast('请填写详细内容')
        }
      },
      smt() {
        http({
          method: 'post',
          url: '/sapi/iwantsay/say/save',
          data: this.form
        }, loading => {
          this.$message.loading(loading)
        }).then(res => {
          if (res.result === 1) {
            this.$message.toast(res.message)
            this.$router.back()
            this.$emit('refresh')
          } else {
            this.$message.alert(res.message)
          }
        })
      }
    },
    created() {
      const type = this.$route.query.type
      if (type === 'praise') {
        this.text = '我要表扬'
        this.form.est020 = '1'
      } else if (type === 'complaint') {
        this.text = '我要投诉'
        this.form.est020 = '2'
      } else {
        this.text = '我要建议'
        this.form.est020 = '3'
      }
      this.form.aae005 = (this.userInfo && this.userInfo.aae005) || ''
    },
    mounted() {
      this.getUnit()
    }
  }
</script>
<style lang="scss" scoped>
  @import "../../common/style/variable";
  .next{
    padding: .2rem 0;
  }
</style>
